{% extends 'backend_loyout.html' %}

{% block css %}
    <style>
        .personal-title {
            width: 100%;
            height: 48px;
            list-style: none;
            line-height: 48px;
        }

        .personal-title li {
            display: inline-block;
            margin-right: 5px;
        }

        .personal {
            width: 80%;
            margin: 0 auto;
            padding-left: 50px;
        }
        .form-control{
            width: 500px;
            float: right;
        }
        .fm {
            width: 60%;
            margin-left: 100px;
        }
        .form-group{
            float: left;
        }
        .submit-row{
            float: right;
        }
        .blog-manage .item-content{
            display: block;
        }
    </style>
{% endblock %}

{% block content %}
    <ul class="personal-title">
        <li style="color: #2aabd2">个人管理</li>
        <li><i class="fa fa-arrow-right" style="margin-right: 5px;"></i>博客管理</li>
    </ul>
    <div class="personal">
         <form class="fm" method="post" action="{% url 'backend:personal_update_pwd' %}" novalidate>
            {% csrf_token %}
            <div class="form-group">
                <label for="username">个人博客站点前缀</label>
                <input type="text" class="form-control" id="suffix" value="{{ blog.suffix }}">
            </div>
            <div class="form-group">
                <label for="theme">主题</label>
                <select name="theme">
                    <option readonly>warm</option>
                </select>
            </div>
            <div class="form-group">
                <label for="title">博客标题</label>
                <input type="text" class="form-control" id="title" value="{{ blog.title }}">
            </div>
            <div class="form-group">
                <label for="pwd">博客简介</label>
                <textarea rows="3" class="form-control" name="summary">{{ blog.summary }}</textarea>
             </div>
            <div class="submit-row">
                <a id="submit" class="btn btn-primary">提 交</a>
            </div>
        </form>
    </div>
{% endblock %}

{% block js %}
    <script src="/static/plugins/kingeditor/kindeditor-all-min.js"></script>
    <script src="/static/plugins/kingeditor/lang/zh-CN.js"></script>
    <script>
        var editor;
        KindEditor.ready(function (K) {
            editor = K.create('textarea[name="summary"]', {
                height: '200px',
                resizeType: 1, //1可以拖动下边框 2随意拖动
                allowPreviewEmoticons: true, //表情预览
                allowImageUpload: true,  //是否允许图片上传
                items: [
                    'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
                    'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
                    'insertunorderedlist', '|', 'emoticons', 'image', 'link'],
                uploadJson: '{% url "comment_images" %}',
                filePostName: 'images',
            });
        });

        $('#submit').click(function () {
            var suffix = $('#suffix').val();
            var title = $('#title').val();
            var summary = editor.html();
            $.ajax({
                url:'{% url "backend:personal_update_blog" %}',
                type:'POST',
                data:{'suffix':suffix,'title':title,'summary':summary},
                dataType:'JSON',
                success:function (arg) {
                    console.log(arg);
                    if (arg.status){
                        alert('修改成功');
                        setTimeout(3);
                        window.location.href = '{% url "backend:personal_blog" %}';
                    }
                    else {
                        alert(arg.message);
                    }
                }
            })
        })
    </script>
{% endblock %}